<template>
  <div class="more-discuss">
    <!-- [title为标题] [xs为 1就是返回按钮 为空是不显示(xs为1,fh就必须为1)] 
    [icon 空为没有 有就显示图标 el-icon-s-operation][bgcolor 1为白色背景 空为透明]
    [fh 有返回,fh=1;有图标,fh=2]-->

    <Head title="评论"
          xs="1"
          fh="1"
          icon=""
          bgcolor="" />

    <div>
      <Dis />
      <Dis />
      <Dis />
    </div>

    <div class="footer">
      <div class="footer-l">
        <input type="text"
               placeholder="发表评论...">
        <i class="iconfont icon-xiaolian"></i>
      </div>
      <div class="footer-r">
        <p>发布</p>
      </div>
    </div>
  </div>
</template>

<script>
import Head from "@/components/Fb_body/Head.vue";
import Dis from "@/components/Discuss/Dis.vue";
export default {
  name: "moreDiscuss",
  components: {
    Head, Dis
  },

}

</script>

<style lang="scss" scoped>
@import "https://at.alicdn.com/t/font_2877559_ign32b3wzlp.css?spm=a313x.7781069.1998910419.132&file=font_2877559_ign32b3wzlp.css";

.footer {
  width: 100%;
  height: 50px;
  border-top: 1px solid #cccccc;
  position: fixed;
  left: 0;
  bottom: 0; 
  display: flex;
  align-items: center;
  justify-content: space-around;
  background-color: white;
  box-sizing: border-box;

  .footer-l {
    height: 100%;
    border-right: 1px solid #cccccc;
    input {
      height: 40px;
      border: none;
      font-size: 20px;
      outline: none;
    }
    i {
      font-size: 27px;
      text-align: center;
      line-height: 50px;
      margin-right: 5px;
    }
  }

  .footer-r {
    width: 22%;
    height: 100%;
    text-align: center;
    line-height: 50px;
    font-size: 20px;
  }
}
</style>